<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Google font -->
    <link href="https://fonts.googleapis.com/css?family=Hind:400,700" rel="stylesheet">
    <!-- Bootstrap -->
    <link type="text/css" rel="stylesheet" href="/static/myhome/assets/css/bootstrap.min.css"/>
    <!-- Slick -->
    <link type="text/css" rel="stylesheet" href="/static/myhome/assets/css/slick.css"/>
    <link type="text/css" rel="stylesheet" href="/static/myhome/assets/css/slick-theme.css"/>
    <!-- nouislider -->
    <link type="text/css" rel="stylesheet" href="/static/myhome/assets/css/nouislider.min.css"/>
    <!-- Font Awesome Icon -->
    <link rel="stylesheet" href="/static/myhome/assets/css/font-awesome.min.css">
    <!-- Custom stlylesheet -->
    <link type="text/css" rel="stylesheet" href="/static/myhome/assets/css/style.css"/>

</head>

<body>
<!-- HEADER -->
<header>
    <!-- header -->
    <div id="header">
        <div class="container">
            <div class="pull-left">
                <!-- Logo -->
                <div class="header-logo">
                    <a class="logo" href="#">
                        <img src="/static/myhome/assets/img/logo.png" alt="">
                    </a>
                </div>
                <!-- /Logo -->
                <!-- Search -->
                <div class="header-search">
                    <form>
                        <input class="input search-input" type="text" placeholder="输入您的关键字">
                        <select class="input search-categories">
                            <option value="0">所有类别</option>
                            <option value="1">Category 01</option>
                            <option value="1">Category 02</option>
                        </select>
                        <button class="search-btn"><i class="fa fa-search"></i></button>
                    </form>
                </div>
                <!-- /Search -->
            </div>
            <div class="pull-right">
                <ul class="header-btns">
                    <!-- Account -->
                    <li class="header-account dropdown default-dropdown">
                        <div class="dropdown-toggle" role="button" data-toggle="dropdown" aria-expanded="true">
                            <div class="header-btns-icon">
                                <i class="fa fa-user-o"></i>
                            </div>
                            <strong class="text-uppercase">我的账户 <i
                                    class="fa fa-caret-down"></i>&nbsp;&nbsp;</strong>
                            <br>
                            {% if request.session.VipUser.id %}
                            <span><a href="#">{{ request.session.VipUser.phone}}</a></span>
                            {% else %}
                            <span><a href="{% url 'myhome_login' %}" class="text-uppercase">请登录</a></span>
                            {% endif %}
                        </div>
                        <ul class="custom-menu">
                            {% if request.session.VipUser.id %}
                            <li><a href="#"><i class="fa fa-user-o"></i> 账户管理</a><hr>
                                <a href="#"><i class="right"></i> &nbsp;&nbsp;&nbsp; 会员名: 喵锅先森€ </a>
                                <a href="#"><i class="right"></i> &nbsp;&nbsp;&nbsp; 普通会员 </a>
                                <a href="#"><i class="right"></i> &nbsp;&nbsp;&nbsp; 森森值: 230 </a>
                                <a href="#"><i class="right"></i> &nbsp;&nbsp;&nbsp; 绑定手机: {{ request.session.VipUser.phone}} </a><hr>
                            </li>
                            {% else %}
                            <li><a href="#"><i class="fa fa-user-o"></i> 账户管理</a></li>
                            {% endif %}
                            <li><a href="{% url 'myhome_login' %}"><i class="fa fa-unlock-alt"></i> 登陆 </a></li>
                            <li><a href="{% url 'myhome_register' %}"><i class="fa fa-user-plus"></i>注册 </a></li>
                            <li><a href="{% url 'myhome_logout' %}"><i class="fa fa-heart-o"></i> 退出</a></li>
                        </ul>
                    </li>
                    <!-- /Account -->
                    <!-- Cart -->
                    <li class="header-cart dropdown default-dropdown">
                        <a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true"></a>
                            <div class="header-btns-icon">
                                <i class="fa fa-shopping-cart"></i>
                                <span class="qty">2</span>
                            </div>
                    <li><a href="{% url 'myhome_cart' %}"><strong class="text-uppercase">我的购物车</strong>&nbsp;&nbsp;</a>
                    </li>
                    <!-- /Cart -->
                    <!-- Mobile nav toggle-->
                    <li class="nav-toggle">
                        <button class="nav-toggle-btn main-btn icon-btn"><i class="fa fa-bars"></i></button>
                    </li>
                    <!-- / Mobile nav toggle -->
                </ul>
            </div>
        </div>
        <!-- header -->
    </div>
    <!-- container -->
</header>
<!-- /HEADER -->
<!-- NAVIGATION -->
<div id="navigation">
    <!-- container -->
    <div class="container">
        <div id="responsive-nav">
            <!-- category nav -->
            <div class="category-nav">
                <span class="category-header">所有图书分类<i class="fa fa-list"></i></span>
                <ul class="category-list">
                    {% for i in booktypes %}
                    <li class="dropdown side-dropdown">
                        <a  href="{% url 'myhome_list' i.id %}" class="dropdown-toggle" data-toggle="dropdown"
                           aria-expanded="true">&nbsp;&nbsp;&nbsp;&nbsp; {{i.name}} <i
                                class="fa fa-angle-right"></i></a>

                        <div class="custom-menu" style="width:390px;">
                            <div class="col-md-4">
                                <ul class="list-links">
                                    {% for v in i.sub %}
                                    <li><a href="{% url 'myhome_list' v.id %}">{{v.name}}</a></li>
                                    {% endfor %}
                                </ul>
                            </div>
                        </div>
                    </li>
                    {% endfor %}
                </ul>
            </div>
            <!-- /category nav -->
            <!-- menu nav -->
            <div class="menu-nav">
                <span class="menu-header">Menu <i class="fa fa-bars"></i></span>
                <ul class="menu-list">
                    <li><a href="{% url 'myhome_index' %}">首页</a></li>
                    <li><a href="#">店铺</a></li>
                    <li class="dropdown mega-dropdown full-width">
                        <a class="dropdown-toggle" data-toggle="dropdown" >图书分类<i
                            class="fa fa-caret-down"></i></a>
                        <div class="custom-menu" style="width:850px;">
                            {% for i in booktypes %}
                            <div class="col-md-3" style="height:180px; width:200px;">
                                <hr>
                                <ul class="list-links">
                                    <li>
                                        <a href="{% url 'myhome_list' i.id %}" class="list-links-title">{{i.name}}</a>
                                    </li>
                                    {% for v in i.sub %}
                                    <li><a href="{% url 'myhome_list' v.id %}">{{v.name}}</a></li>
                                    {% endfor %}
                                </ul>
                            </div>
                            {% endfor %}
                        </div>
                    </li>
                    <li><a href="#">销售量</a></li>
                </ul>
            </div>
            <!-- menu nav -->
        </div>
    </div>
    <!-- /container -->
</div>
<!-- /NAVIGATION -->
{% block con %}

{% endblock %}
<!-- HOME -->

<!-- FOOTER -->
<footer id="footer" class="section section-grey">
    <!-- container -->
    <div class="container">
        <!-- row -->
        <div class="row">
            <!-- footer widget -->
            <div class="col-md-3 col-sm-3 col-xs-3">
                <div class="footer">
                    <!-- footer logo -->
                    <div class="footer-logo">
                        <a class="logo" href="#">
                            <img src="/static/myhome/assets/img/logo.png" alt="">
                        </a>
                    </div>
                    <!-- /footer logo -->
                    <p>森野网（www.senye.com）是全球知名的综合性网上购物商城，由国内著名出版机构科文公司、中国集团、华为技术集团、软银中国创业基金共同投资成立。</p>
                    <!-- footer social -->
                    <ul class="footer-social">
                        <li><a href="#"><i class="fa fa-facebook"></i></a></li>
                        <li><a href="#"><i class="fa fa-twitter"></i></a></li>
                        <li><a href="#"><i class="fa fa-instagram"></i></a></li>
                        <li><a href="#"><i class="fa fa-google-plus"></i></a></li>
                        <li><a href="#"><i class="fa fa-pinterest"></i></a></li>
                    </ul>
                    <!-- /footer social -->
                </div>
            </div>
            <!-- /footer widget -->

            <!-- footer widget -->
            <div class="col-md-3 col-sm-3 col-xs-3">
                <div class="footer">
                    <h3 class="footer-header">支付方式</h3>
                    <ul class="list-links">
                        <li><a href="#">网上支付</a></li>
                        <li><a href="#">礼品卡支付</a></li>
                        <li><a href="#">银行转账</a></li>
                        <li><a href="#">礼券支付</a></li>
                    </ul>
                </div>
            </div>
            <!-- /footer widget -->

            <!-- footer widget -->
            <div class="col-md-3 col-sm-3 col-xs-3">
                <div class="footer">
                    <h3 class="footer-header">订单服务</h3>
                    <ul class="list-links">
                        <li><a href="#">配送服务查询</a></li>
                        <li><a href="#">订单状态说明</a></li>
                        <li><a href="#">自助取消订单</a></li>
                        <li><a href="#">自助修改订单</a></li>
                    </ul>
                </div>
            </div>

            <!-- /footer widget -->

            <!-- footer subscribe -->
            <div class="col-md-3 col-sm-6 col-xs-6">
                <div class="footer">
                    <h3 class="footer-header">关于我们</h3>
                    <p>痛苦本身就是爱，主要的吸脂精英，但我给它时间。</p>
                    <form>
                        <div class="form-group">
                            <input class="input" placeholder="输入您的关键字">
                        </div>
                        <button class="primary-btn">加入通讯</button>
                    </form>
                </div>
            </div>
            <!-- /footer subscribe -->
        </div>
        <!-- /row -->
        <hr>
    </div>
    <!-- /container -->
</footer>
<!-- /FOOTER -->

<!-- jQuery Plugins -->
<script src="/static/myhome/assets/js/jquery.min.js"></script>
<script src="/static/myhome/assets/js/bootstrap.min.js"></script>
<script src="/static/myhome/assets/js/slick.min.js"></script>
<script src="/static/myhome/assets/js/nouislider.min.js"></script>
<script src="/static/myhome/assets/js/jquery.zoom.min.js"></script>
<script src="/static/myhome/assets/js/main.js"></script>

</body>

</html>